<template>
	<el-dialog :title="titleMap[mode]" v-model="visible" destroy-on-close @closed="$emit('closed')">
		<el-form :model="form" :rules="rules" ref="dialogForm" label-width="100px" label-position="left">
			<el-steps :active="active" align-center style="margin-bottom: 20px;">
				<el-step title="基本属性"></el-step>
				<el-step title="高级设置"></el-step>
				<el-step title="全局权限"></el-step>
			</el-steps>
			<el-form v-if="active==0" ref="stepForm_0" :model="form" :rules="rules" label-width="100px"
					 label-position="left" :disabled="mode=='show'">
				<el-row :gutter="15">
					<el-col :lg="12">
						<el-form-item label="排序号" prop="sortNo">
							<el-input-number v-model="form.sortNo" placeholder="排序号" clearable></el-input-number>
						</el-form-item>
					</el-col>
					<el-col :lg="12">
						<el-form-item label="公文名称" prop="flowName">
							<el-input v-model="form.flowName" placeholder="公文名称" clearable></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="15">
					<el-col :lg="12">
						<el-form-item label="公文分类" prop="flowSort">
							<el-cascader v-model="form.flowSort" :options="bpmSortList" :props="formSortProps"
										 :show-all-levels="false" clearable style="width: 100%;"></el-cascader>
						</el-form-item>
					</el-col>
					<el-col :lg="12">
						<el-form-item label="公文表单" prop="formId">
							<sc-select v-model="form.formId" :params="{model:'1'}"
									   :apiObj="$API.bpm.bpmForm.getBpmFormListForSelect" clearable filterable
									   style="width: 100%" @change="getBpmFormFieldsListForSelect"></sc-select>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="15">
					<el-col :lg="12">
						<el-form-item label="适用组织" prop="tempOrgId">
							<sc-select v-model="form.tempOrgId" :apiObj="$API.system.tempOrg.getTempUnitListForSelect"
									   clearable filterable style="width: 100%"></sc-select>
						</el-form-item>
					</el-col>
					<el-col :lg="8">
						<el-form-item label="公文类型">
							<el-radio-group v-model="form.flowType" size="small">
								<el-radio-button label="0">常规</el-radio-button>
								<el-radio-button label="1">灵活</el-radio-button>
								<el-radio-button label="2">顺序</el-radio-button>
								<el-radio-button label="3">预设</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :lg="4">
						<el-radio-group v-model="form.isDoc" size="small">
							<el-radio-button label="1">发文</el-radio-button>
							<el-radio-button label="2">收文</el-radio-button>
						</el-radio-group>
					</el-col>
				</el-row>
				<el-form-item label="公文备注">
					<el-input type="textarea" maxlength="150" v-model="form.remark" placeholder="公文备注"
							  clearable></el-input>
				</el-form-item>
			</el-form>
			<el-form v-if="active==1" ref="stepForm_1" :model="form" :rules="rules" label-width="100px"
					 label-position="left" :disabled="mode=='show'">
				<el-row :gutter="15">
					<el-col :lg="12">
						<el-form-item label="标题规则">
							<el-input v-model="form.docNumRule" placeholder="标题规则" clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :lg="12">
						<el-form-item label="起始文号">
							<el-input v-model="form.beginDocNum" placeholder="起始文号" clearable></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="15">
					<el-col :lg="12">
						<el-form-item label="委托规则">
							<el-radio-group v-model="form.freeToOther">
								<el-radio-button label="0">禁止</el-radio-button>
								<el-radio-button label="1">自由</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :lg="12">
						<el-form-item label="行政级别审批">
							<el-radio-group v-model="form.userLevelFlag">
								<el-radio-button label="0">禁止</el-radio-button>
								<el-radio-button label="1">开启</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="15">
					<el-col :lg="12">
						<el-form-item label="表单水印">
							<el-radio-group v-model="form.waterMark">
								<el-radio-button label="0">禁用</el-radio-button>
								<el-radio-button label="1">开启</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :lg="12">
						<el-form-item label="水印规则" v-if="form.waterMark=='1'">
							<el-input v-model="form.prefixWaterMark" placeholder="水印规则" clearable></el-input>
							<div class="el-form-item-msg">[U]:用户姓名[D]:部门名称[L]:行政级别[F]:流程标题[T]:时间</div>
						</el-form-item>
					</el-col>
				</el-row>
				<el-form-item label="隐藏字段">
					<el-checkbox-group v-model="form.printField">
						<template v-for="item in formFieldList" :key="item.id">
							<el-checkbox :label="item.id" v-if="item.elType!=='data-fill'">{{
									item.label
								}}
							</el-checkbox>
						</template>
					</el-checkbox-group>
				</el-form-item>
			</el-form>
			<el-form v-if="active==2" label-width="100px" label-position="left" :disabled="mode=='show'">
				<el-row :gutter="15">
					<el-col :lg="12">
						<el-form-item label="是否可撤销">
							<el-radio-group v-model="form.isRevoke">
								<el-radio-button label="0">禁止</el-radio-button>
								<el-radio-button label="1">允许</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :lg="12">
						<el-form-item label="打印权限">
							<el-radio-group v-model="form.printFlag">
								<el-radio-button label="0">禁止</el-radio-button>
								<el-radio-button label="1">允许</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="15">
					<el-col :lg="12">
						<el-form-item label="附件下载">
							<el-radio-group v-model="form.attachRole">
								<el-radio-button label="0">禁止</el-radio-button>
								<el-radio-button label="1">允许</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :lg="12">
						<el-form-item label="回退会签见意">
							<el-radio-group v-model="form.ideaTextFlag">
								<el-radio-button label="0">随意</el-radio-button>
								<el-radio-button label="1">必填</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-form-item label="导出权限">
						<el-checkbox-group v-model="form.expRole">
							<el-checkbox label="1">允许邮件抄送</el-checkbox>
							<el-checkbox label="2">允许转发通知</el-checkbox>
							<el-checkbox label="3">允许导出Pdf</el-checkbox>
							<el-checkbox label="4">允许导出Word</el-checkbox>
							<el-checkbox label="5">允许导出Html</el-checkbox>
						</el-checkbox-group>
					</el-form-item>
				</el-row>
				<el-form-item label="查询权限">
					<select-user-dialog v-model:accountId="form.queryRole" :mode="true"/>
				</el-form-item>
				<el-form-item label="管理权限">
					<select-user-dialog v-model:accountId="form.manageRole" :mode="true"/>
				</el-form-item>
			</el-form>
		</el-form>
		<template #footer>
			<el-button v-if="active>0 && active<3" @click="pre" :disabled="isSaveing">上一步</el-button>
			<el-button v-if="active<2" type="primary" @click="next">下一步</el-button>
			<el-button v-if="active==2 && mode!='show'" type="primary" @click="submit" :loading="isSaveing">保存
			</el-button>
		</template>
	</el-dialog>
</template>

<script>
import SelectUserDialog from "@/views/module/selectUserDialog";

export default {
	components: {SelectUserDialog},
	emits: ['success', 'closed'],
	data() {
		return {
			loading: false,
			active: 0,
			mode: "add",
			titleMap: {
				add: '创建公文',
				edit: '修改公文',
				show: '查看公文'
			},
			bpmSortList: [],
			formSortProps: {
				label: "name",
				value: "sortId",
				emitPath: false,
				checkStrictly: true
			},
			formFieldList: [],
			form: {
				flowId: "",
				sortNo: 1,
				isDoc: '1',
				model: '1',
				flowName: "",
				flowSort: "",
				formId: "",
				tempOrgId: "0",
				flowType: "0",
				remark: "",
				beginDocNum: "",
				docNumRule: "[D]-[U]-[F]-[T]",
				freeToOther: "0",
				userLevelFlag: "0",
				waterMark: "0",
				isRevoke: "1",
				queryRole: '',
				manageRole: '',
				prefixWaterMark: "",
				printField: [],
				printFlag: "1",
				attachRole: "1",
				expRole: ['1','2','3','4','5'],
				ideaTextFlag: "1"
			},
			visible: false,
			isSaveing: false,
			rules: {
				flowName: [
					{required: true, message: '请输入公文名称', trigger: 'blur'}
				],
				formId: [
					{required: true, message: '请输入表单名称', trigger: 'blur'}
				],
				flowSort: [
					{required: true, message: '请选择公文分类', trigger: 'blur'}
				],
				tempOrgId: [
					{required: true, message: '请选择适用组织', trigger: 'blur'}
				]
			},
		}
	},
	created() {
	},
	mounted() {
		this.getBpmSortTree();
	},
	methods: {
		//显示
		open(mode = 'add') {
			this.mode = mode;
			this.visible = true;
			return this;
		},
		next() {
			const formName = `stepForm_${this.active}`
			this.$refs[formName].validate((valid) => {
				if (valid) {
					this.active += 1
				} else {
					return false
				}
			})
		},
		//上一步
		pre() {
			this.active -= 1
		},
		async getBpmSortTree() {
			var res = await this.$API.bpm.bpmSort.getBpmSortTree.get({model: '1'});
			if (res.code == 200) {
				this.bpmSortList = res.data;
			}
		},
		async getBpmFormFieldsListForSelect() {
			var res = await this.$API.bpm.bpmForm.getBpmFormFieldsListForSelect.get({formId: this.form.formId});
			if (res.code == 200) {
				this.formFieldList = res.data;
			}
		},
		//表单提交方法
		submit() {
			this.$refs.dialogForm.validate(async (valid) => {
				if (this.form.printField) {
					this.form.printField = this.form.printField.join(",");
				}
				if (this.form.expRole) {
					this.form.expRole = this.form.expRole.join(",");
				}
				if (valid) {
					this.isSaveing = true;
					var res;
					if (this.mode == "add") {
						res = await this.$API.bpm.bpmFlow.insert.post(this.form);
					} else if (this.mode == "edit") {
						res = await this.$API.bpm.bpmFlow.update.post(this.form);
					}
					this.isSaveing = false;
					if (res.code == 200) {
						this.$emit('success')
						this.visible = false;
						this.$message.success("操作成功")
					} else {
						this.$alert(res.message, "提示", {type: 'error'})
					}
				}
			})
		},
		//表单注入数据
		setData(data) {
			this.form.flowId = data.flowId
			this.form.sortNo = data.sortNo
			this.form.flowName = data.flowName
			this.form.isDoc = data.isDoc
			this.form.model = data.model
			this.form.flowSort = data.flowSort
			this.form.formId = data.formId
			this.form.tempOrgId = data.tempOrgId
			this.form.flowType = data.flowType
			this.form.remark = data.remark
			this.form.beginDocNum = data.beginDocNum
			this.form.docNumRule = data.docNumRule
			this.form.freeToOther = data.freeToOther
			this.form.userLevelFlag = data.userLevelFlag
			this.form.waterMark = data.waterMark
			this.form.isRevoke = data.isRevoke
			this.form.prefixWaterMark = data.prefixWaterMark
			this.form.printField = data.printField.split(',')
			this.form.printFlag = data.printFlag
			this.form.attachRole = data.attachRole
			this.form.expRole = data.expRole.split(",")
			this.form.ideaTextFlag = data.ideaTextFlag
			this.form.queryRole = data.queryRole;
			this.form.manageRole = data.manageRole
			if (this.form.formId != '') {
				this.getBpmFormFieldsListForSelect();
			}
		},

	}
}
</script>

<style>
</style>
